<template>
  <div id="app">
    <Header ref="header"
            :class="{'home-header':$route.path==='/'}"></Header>
    <router-view ref="main" />
    <Footer v-if="!$route.path.includes('/doc')"></Footer>
  </div>
</template>
<script>
import Header from "@/components/Header";
import Footer from "@/components/Footer";

export default {
  components: {
    Header,
    Footer
  },
  data () {
    return {
      reload: false,
    };
  },
  created () {
    // this.$httpajax.get('https://jk.avuejs.com/piao').then(res => {
    //   const obj = res.data[0].piao
    // this.$notify({
    //   title: `Avue needs you！！！！`,
    //   type: 'info',
    //   duration: 0,
    //   showClose: false,
    //   dangerouslyUseHTMLString: true,
    //   message: '投2票后(手机微信打开和电脑打开可以各投一次)，拿截图联系客服(QQ:1547207846)，即可免费领取59元的<a href="https://www.kancloud.cn/smallwei/avue" target="__blank">avue-cli脚手架(后台模板)</a>文档一份<br /><a target="__blank" href="https://www.oschina.net/p/avue">点击我投票</a>',
    //   offset: 50
    // });
    // })

/*
    setTimeout(() => {
      this.$notify({
        title: "号外号外",
        message: `近期将会推出数据大屏2.0，价格将会有所调整,购买当前版本的可以免费升级<br />
        对了！avue-cli的2.0版本已经免费开源`,
        duration: 0,
        dangerouslyUseHTMLString: true,
        offset: 50,
        onClick: () => {
          window.open("https://avuejs.com/vip")
        }
      });
    }, 0)
    setTimeout(() => {
      this.$notify({
        title: "关注作者抖音",
        dangerouslyUseHTMLString: true,
        message: "<b>喧嚣繁华的快节奏生活中，希望我的抖音能给你带来一丝的欢乐，点击我关注～。～</b><br /><br />顺便送你们个福利，关注后联系客服（QQ:1547207846）领取<a href='https://www.kancloud.cn/smallwei/avue' target='__blank'>avue-cli脚手架(后台模板)</a>文档一份<br />",
        duration: 0,
        offset: 60,
        onClick: () => {
          this.reload = true;
        }
      });
    }, 0)
*/

  },
  mounted () {
    window.addEventListener('scroll', this.handleScroll)
  },
  methods: {
    handleScroll () {
      var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
      if (scrollTop <= 1000) {
        this.$refs.header.height = scrollTop * 0.1;
      }
    },
  }
};
</script>
<style lang="scss">
.pusher {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  transition: all 0.5s;
}

.pusher.is-active {
  -webkit-filter: blur(5.01px);
  filter: blur(5.01px);
}
* {
  margin: 0;
  padding: 0;
}

::-webkit-scrollbar-track-piece {
  background-color: transparent;
}
::-webkit-scrollbar {
  width: 7px;
  height: 7px;
  background-color: transparent;
}
::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background-color: hsla(220, 4%, 58%, 0.3);
}
a {
  color: #1494E3;
  background-color: transparent;
  text-decoration: none;
  outline: none;
  cursor: pointer;
  transition: color 0.3s;
}
#app {
  font-family: "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #2c3e50;
  background-color: #eee;
}
.el-main {
  padding: 0 20px;
}
</style>
